{% extends '_layout/base.html' %}
{% load i18n %}
{% load static %}

{% block pageTitle %}
  {% if action == 'modify' %}
    {% trans 'Modify Data' %}
  {% else %}
    {% trans 'Commit Data' %}
  {% endif %}
{% endblock %}

{% block pageHeadExtra %}
  <link href="https://cdn.bootcss.com/jquery.perfect-scrollbar/0.8.1/css/perfect-scrollbar.min.css" rel="stylesheet">
  <script src="https://cdn.bootcss.com/jquery.perfect-scrollbar/0.8.1/js/perfect-scrollbar.jquery.min.js"></script>
  <link href="{% static 'css/modal-dialog.css' %}" rel="stylesheet">

  <link href="{% static 'css/mlplatform/square/green.css' %}" rel="stylesheet">
  <script src="{% static 'js/mlplatform/icheck.js' %}"></script>
{% endblock %}

{% block pageBody %}
  {% include 'basic/header.html' %}

  <div class="page container">
    <h1>
      {% trans 'Commit Data' %}
    </h1>
    <div class="panel panel-default">
      <div class="panel-body">
        <div class="dividing"></div>
        <div id="by-file" class="tab-pane">
          <h3 style="text-align: center">{% trans 'Upload your file' %}</h3>
          <form  id="uploadForm"  method="post" enctype="multipart/form-data">
              {% csrf_token %}
            <div class="row">
              <div class="col-lg-6 col-sm-6">
                <div class="input-group" style="padding-left: 300px;width: 880px">
                  <input id="true-file" type="file" name="files" style="display: none;"
                         onchange="Utils.afterChooseFile(this)"
                         accept=".xlsx, .xls, .xml, .txt, .csv">
                  <input class="form-control"
                         placeholder="{% trans 'Choose your data file then upload it' %}。上传.xlsx, .xlx, .txt, .csv文件"
                         disabled>
                  <div class="input-group-btn">
                    <button class="btn btn-primary" type="button" onclick="Utils.chooseFile(this)">
                      {% trans 'Choose File' %}
                      <i class="fa fa-mouse-pointer" aria-hidden="true"></i>
                    </button>
                  </div>
                  <div class="col-lg-6 col-sm-6">
                    <button class="btn btn-primary" type="button" id="submit">
                      {% trans 'Upload' %}
                      <i class="fa fa-upload"></i>
                    </button>
                  </div>

                </div>
              </div>
            </div>
            <br/>
            <div class="form-group required" style="padding-left: 300px;width: 800px">
              <label for="d-title">{% trans 'Title' %}</label>
              <input class="form-control" id="title" name="title"
                     placeholder="{% trans 'Data title(required)' %}"
                     data-vf="true" data-vf-regex="^$|\\s+" data-vf-inverse="true"
                     data-vf-help="{% trans 'This field cannot be null' %}" required>
            </div>
{#            <div class="form-group" style="padding-left: 300px;width: 800px">#}
{#                <label for="d-purpose">{% trans 'Purpose' %}</label>#}
{#                <select class="form-control" id="d-purpose" name="d-purpose"#}
{#                        data-vf="true" data-vf-regex="\d+"#}
{#                        data-vf-help="{% trans 'Please select your purpose' %}">#}
{#                    <option value="null">----- {% trans 'Please select your purpose' %} -----</option>#}
{#                    <option value="cla">分类</option>#}
{#                    <option value="re">回归</option>#}
{#                </select>#}
{#            </div>#}
            <div class="collapse in" style="padding-left: 300px;width: 800px">
              <label for="d-abstract">{% trans 'Public' %}</label>
              <input type="checkbox" id="is_public" checked>
            </div>
            <div class="collapse in" id="collapseExtra" style="padding-left: 300px;width: 800px">
              <div class="form-group">
                <label for="d-abstract">{% trans 'Abstract' %}</label>
                <input class="form-control" id="abstract" name="abstract"
                       placeholder="{% trans 'Abstract of this data' %}">
              </div>
            </div>
          </form>
          <div class="dividing"></div>
        </div>
      </div>
    </div>
  </div>

  {% include 'basic/footer.html' %}
{#  {% include '_component/corner-buttons.html' %}#}
{#  {% include '_component/fast-feedback.html' %}#}
{#  {% include '_component/shopping-cart.html' %}#}
{#  {% include '_component/modal-dialog-overlay.html' %}#}
{% endblock %}

{% block pageFootExtra %}
  <script src="{% static 'js/storage/storage.js' %}"></script>
  <script src="{% static 'js/storage/upload_dataset.js' %}"></script>
  <link href="{% static 'css/storage/data.css' %}" rel="stylesheet">
{% endblock %}
